<template>
  <div class="body1" style="padding-top:10px;">
    <div class="form_select">
      <div>
          <el-input class="select_input" size="small" v-model="name" placeholder="供应商名称"></el-input>
          <el-select class="select_option1" size="small" v-model="cid" placeholder="供应商分类">
            <el-option
              v-for="item in cate"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
          <el-date-picker
            @change="sdateChage"
            v-model="sdate"
            type="date"
            placeholder="选择开始日期" 
            size="small" 
            class="select_option1"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            >
          </el-date-picker>
          <el-date-picker
            @change="edateChage"
            v-model="edate"
            type="date"
            placeholder="选择结束日期" 
            size="small" 
            class="select_option1"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            >
          </el-date-picker>
          <el-button type="primary"  size="small" @click="search">搜索</el-button>
      </div>
      <div class="select_right">
          <!--<el-button type="primary"  size="medium" @click="search">excel导出</el-button>-->
          <el-dropdown>
            <el-button type="primary" size="small">
              更多操作<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item @click.native="cateClick('cateShow')">供应商分类</el-dropdown-item>
              <el-dropdown-item>导出当页</el-dropdown-item>
              <el-dropdown-item>导出全部</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
          <el-button type="primary"  size="small" @click="add">+添加供应商</el-button>
      </div>
    </div>
    <supplyTable :list="list" @func="editTrue"></supplyTable>
    <supplyAdd :show="addShow" @func="change" :cate="cateArr"></supplyAdd>
    <supplyEdit :show="editShow" @func="change" :cate="cateArr" :item="item"></supplyEdit>
    <supplyCate :show="cateShow" :cate="cateArr" @func="change"></supplyCate>
    </div>
   </div>


</template>
 
<script>
import supplyAdd from "./add"
import supplyEdit from "./edit"
import supplyTable from "./table"
import supplyCate from "./cate"
export default {
  name: "Supply",
  data() {
    return {
      list:[],
      name:'',
      cate:[
        {id:0,name:'全部'}
      ],
      userArr:[
        {id:0,username:'全部'}
      ],
      cid:'',
      sdate:'',
      edate:'',
      user_id:'',
      item:{},
      addShow:false,
      editShow:false,
      cateArr:[],
      user:[],
      cateShow:false
    };
  },
  components: {
    "supplyAdd": supplyAdd,
    "supplyEdit": supplyEdit,
    "supplyTable": supplyTable,
    "supplyCate":supplyCate
  },
  created: function() {
    this.getList()
    this.getCate()
  },
  methods: {
    getList:function(){
      if(this.sdate && !this.edate){
        this.$message.error('请选择开始时间和结束时间!');
        return;
      }
      if(!this.sdate && this.edate){
        this.$message.error('请选择开始时间和结束时间!');
        return;
      }
      if(this.sdate > this.edate){
        this.$message.error('开始时间不能大于结束时间!');
        return;
      }
      var data = {
        store_id:localStorage.getItem('store_id'),
        name:this.name,
        cid:this.cid,
        user_id:this.user_id,
        sdate:this.sdate,
        edate:this.edate
      }
      var that = this
      this.$get('supply/all',data).then((res) => {
        that.list = res.data
      })
    },
    getCate:function(){
      var data = {store_id:localStorage.getItem('store_id')}
      var that = this
      this.$get('supply/cate',data).then((res) => {
        that.cateArr = res.data
        var cate = that.cate
        that.cate = cate.concat(res.data)
      })
    },
    sdateChage:function(e){
      this.sdate = e
    },
    edateChage:function(e){
      this.edate = e
    },
    search:function(){
      this.getList()
    },
    add:function(){
      this.addShow = true
    },
    change:function(data){
      this[data.key] = false
      this.getList()
      if(data.type == 1){
        this.cate = [
          {id:0,name:'全部'}
        ]
        this.getCate()
      }
    },
    editTrue:function(data){
      this[data.key] = true
      this.item = data.item
    },
    cateClick:function(index){
      this[index] = true
    }
}
};
</script>
<style>
</style>